<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <script src="../lib/angularjs.js"></script>
</head>

<body ng-app="myApp" ng-controller="myCtrl">
    <h3>{{text}}</h3>
    <div>
        <label for="1">ng-click：<input id="1" type="text" ng-click="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="2">ng-dblclick：<input id="2" type="text" ng-dblclick="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="3">ng-change：<input id="3" type="text" type="text" ng-change="change($event)"
                ng-model="text"></label>
    </div>
    <div>
        <label for="4">ng-blur：<input id="4" type="text" ng-blur="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="5">ng-focus：<input id="5" type="text" ng-focus="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="6">ng-keydown：<input id="6" type="text" ng-keydown="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="7">ng-keypress：<input id="7" type="text" ng-keypress="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="8">ng-keyup：<input id="8" type="text" ng-keyup="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="9">ng-mouseenter：<input id="9" type="text" ng-mouseenter="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="10">ng-mouseleave：<input id="10" type="text" ng-mouseleave="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="11">ng-mousemove：<input id="11" type="text" ng-mousemove="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="12">ng-mousedown：<input id="12" type="text" ng-mousedown="event($event)" ng-model="text"></label>
    </div>
    <div>
        <label for="12">ng-mouseup：<input id="12" type="text" ng-mouseup="event($event)" ng-model="text"></label>
    </div>
</body>

<script>
    const myApp = angular.module("myApp", [])
    myApp.controller("myCtrl", ["$scope", function ($scope) {
        $scope.text = "啥都没"
        $scope.joinStr = (str) => `当前是ng-${str}事件。`
        $scope.event = function (e) {
            console.log(e);
            this.text = this.joinStr(e.type)
        }
        $scope.change = function () {
            this.text = this.joinStr("change")
        }
    }])
</script>

</html>